/**
 * 自定义InputNumber组件
 */
import React from 'react';
import { InputNumber } from 'antd';
import styles from './style.less';

class inputnumber extends React.PureComponent {
  render() {
    const { id, value, styleRow = {}, onBlur, step, onChange, min, max, disabled, prefix = '', suffix = '', unit, precision, splitStyle, parser, formatter } = this.props;
    let unitNum = unit ? unit.length : 0;
    let reg = /^[\u4e00-\u9fa5]+$/; //判断是否是中文
    let isChinese = reg.test(unit);
    return (
      <span className={disabled ? `${styles.suffixDisable} ant-input-number` : 'ant-input-number'} style={{ display: 'inline-flex', alignItems: 'center' }}>
        {/* width: unitNum == 0 ? styleRow.width ? styleRow.width : '100%' : `calc(${styleRow.width ? styleRow.width : '100%'} - ${(isChinese?14:9) * unitNum + 12 * 2}px)`  */}
        <InputNumber
          id={id}
          className={styles.inputNumber}
          style={{ ...styleRow }}
          value={value}
          min={splitStyle ? min || 0 : min}
          max={max}
          precision={precision}
          onChange={onChange}
          onBlur={onBlur}
          step={step}
          placeholder={this.props.placeholder}
          formatter={
            formatter
              ? formatter
              : (value) => {
                  if (splitStyle) {
                    const t = `${value}`.split('.');
                    let temp = `${t[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',')}${value.toString().indexOf('.') !== -1 ? '.' : ''}${t[1] || ''}`;
                    return `${prefix}${temp}${suffix}`;
                  } else {
                    return `${prefix}${value}${suffix}`;
                  }
                }
          }
          parser={
            parser
              ? parser
              : (value) => {
                  if (splitStyle) {
                    return value
                      .replace(prefix, '')
                      .replace(suffix, '')
                      .replace(/\$\s?|(,*)/g, '');
                  } else {
                    return value.replace(prefix, '').replace(suffix, '');
                  }
                }
          }
          disabled={disabled}
        />
        {unitNum > 0 && <div className={styles.suffix}>{unit}</div>}
      </span>
    );
  }
}

export default inputnumber;
